<template>
  <div class="container">
    <div v-if="!isEmpty">
      <!-- 收货人信息 -->
    <div :ref="abc" class="gerAddr" @tap="handleAddress" v-if="!address.username">
      获取收货地址
      <span></span>
    </div>
    <div class="cart-top" @tap="handleAddress" v-if="address.username">
      <div class="receive">
        <div class="name">
          收货人:{{address.username}}
        </div>
        <div class="phonen-number">
          {{address.telNumber}}
        </div>
      </div>
      <div class="address">
        收货地址: {{address.addr}}
      </div>

      <img
        src="../../../static/images/cart_border@2x.png"
        class="address-bar"
      />
    </div>

    <!-- 搜索人为空时候去新增收货人 -->
    <!-- <div class="add_addresss" @tap="handleAddress" v-if="!address.userName">
    <text>新增收货人</text>
    <span></span>
    </div> -->

    <div class="list-title">
      <span class="iconfont icon-dibiao"></span>
      优购生活馆
    </div>
    <!-- 购物车列表头部 -->
    <div class="ware-list">
      <div class="ware-item" v-for="(item,index) in goods" :key="index">
        <!-- 左侧的按钮 -->
        <div class="choice-button" @tap="handleSelect(item)" >
          <!-- <icon type="success" :color="item.selected ? 'red' : '#999'" size="18"/> -->
          <icon type="success" :color="item.selected?'red': '#999'" size="18" />
        </div>
        <div class="ware-content">
          <!-- 左侧的图片 -->
          <navigator class="ware-image" :url="'/pages/goods_detail/main?goods_id='+ item.goods_id" >
            <image :src="item.goods_small_logo"/>
            
          </navigator>

          <!-- 右边的商品信息 -->
          <div class="ware-info">
            <navigator :url="'/pages/goods_detail/main?goods_id='+item.goods_id" class="ware-title" >
              {{item.goods_name}}
            </navigator>
            <div class="ware-info-btm">
              <div class="ware-price">
                <span>￥</span> {{item.goods_price}}
              </div>

              <!-- 修改商品的数量 -->
              <div class="calculate">
                <div class="calculate">
                  <div class="rect" @tap="handleDecrease(item)" >-</div>
                  <div class="number num">
                    {{item.num}}
                  </div>
                  <div class="rect" @tap="handleIncrease(item)" >+</div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 结算 -->
      <div class="cart-total">
        <!-- 全选的按钮 -->
        <div class="total-button" @tap="handleAllSelect">
          <icon type="success" :color="allSelected?'red':'#999'" size="18"/>全选
        </div>
        <!--合计价格 -->
        <div class="total-center">
          <div class="total-price">
          合计： 
          <text class="colorRed">
              <text>￥</text>{{allPrice}}
          </text>
          </div>
          <div class="price-tips">
          包含运费
          </div>
        </div>
        <!-- 结算 -->
        <div class="accounts" @tap="handleBuy">
            结算
        </div>
      </div>
    </div>
      <div class="cart-empty" v-if="isEmpty">
        <img src="../../../static/images/cart_empty@2x.png" mode="aspectFill">
        <p>购物车为空！</p>
      </div>
  </div>
</template>

<script>
import control from "./control.js"
export default control;
</script>

<style scoped lang="scss">
  @import "style.scss";
</style>
